<template>
  <v-app>
    <app-bar :tabs="tabs"></app-bar>
    <drawer :tabs="tabs">></drawer>
    <regis-box></regis-box>
    <login></login>
    <v-main>
      <router-view></router-view>
    </v-main>
    <message></message>
    <bottom-navigation></bottom-navigation>
    <snackbar></snackbar>
    <v-footer
      color="overall"
      class="pt-10"
      height="200"
      v-if="$vuetify.breakpoint.smAndUp"
    >
      <r-footer>测试</r-footer>
    </v-footer>
  </v-app>
</template>

<script>
import AppBar from "./components/app/appBar.vue";
import BottomNavigation from "./components/app/bottomNavigation.vue";
import Drawer from "./components/app/drawer.vue";
import rFooter from "./components/app/footer.vue";
import Login from "./components/app/login.vue";
import Message from "./components/app/message.vue";
import regisBox from "./components/app/regisBox.vue";
import Snackbar from "./components/app/snackbar.vue";

export default {
  name: "App",

  components: {
    AppBar,
    Drawer,
    rFooter,
    BottomNavigation,
    Message,
    Login,
    regisBox,
    Snackbar,
  },

  data() {
    const that = this;
    return {
      tabs: [
        { icon: "\ue60c", text: "微医首页", path: "/home" },
        { icon: "\ue60b", text: "预约挂号", path: "/registration" },
        { icon: "\ue856", text: "在线问诊", path: "/quiry" },
        { icon: "\ue619", text: "微医团队", path: "/weiyiTeam" },
        { icon: "\ue619", text: "专家团队", path: "/expertsTeam" },
        {
          icon: "\ue619",
          text: "预约管理",
          get path() {
            return that.$store?.state?.profile?.isDoctor
              ? "/resWithDoctor"
              : "/personage";
          },
        },
      ],
    };
  },
};
</script>
<style scoped>
.v-main /deep/.v-main__wrap {
  background-color: #eeeeee;
}
</style>
